<!--
	作者：1055471363@qq.com
	时间：2018-02-23
	描述：
-->
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>登录</title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/style.css" />
		<link rel="stylesheet" href="css/common.css" type="text/css" charset="utf-8" />
		<link rel="stylesheet" href="css/bootstrap.css" />
		<script type="text/javascript" src="js/common.js"></script>
		<style type="text/css">
			div img {
				max-width: 100%;
				height: auto;
			}
			
			.mui-content-padded {
				margin-top: 25px;
			}
		</style>
		<script type="text/javascript" src="barcode_scan.js"></script>

	</head>

	<body>
		<h4 class="mui-pull-left" style="color:blueviolet;font-family: '微软雅黑' ;">EAPClient</h4>
		<a id="setting" class="mui-icon mui-icon-gear mui-pull-right"></a>

		<div class="mui-content">
			<!--<h4 class="text-left" style="color:blueviolet;font-family: '微软雅黑' ;">EAP</h1>-->
			<!--<div class="mui-row">&nbsp;</div>-->
			<!--<h2 class="text-center" style="color:purple;font-family: '微软雅黑';">PDA端</h1>-->
			<div class="mui-row">&nbsp;</div>
			<div class="mui-row">&nbsp;</div>
			<div class="mui-row">&nbsp;</div>
			<div class="mui-row">&nbsp;</div>
			<div class="mui-slider-item mui-slider-item-duplicate">
				<img src="images/login.png">
			</div>
			<br>

			<div class="mui-row">&nbsp;</div>
			<div class="mui-row">&nbsp;</div>
			<div class="mui-row">&nbsp;</div>
			<!--<div class="mui-row">&nbsp;</div>-->
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>用户ID</label>
					<input id='user' type="text" class="mui-input-clear mui-input" placeholder="请输入工号">
				</div>
				<div class="mui-input-row">
					<label>密码</label>
					<input class="mui-input-clear" id="pass" type="password" placeholder="请输入密码">

				</div>
				<div class="mui-input-row">
					<div class="mui-input-row mui-select">
						<label>区域</label>
						<select name="select" id="area">
							<option value="FAB-A" selected="true">FAB-A</option>
							<!--<option value="FAB-B">FAB-B</option>
                        <option value="FAB-C">FAB-C</option>-->

						</select>
					</div>
				</div>
				<br>
			</form>
			<div class="mui-content-padded">
				<button id='loginApp' class="mui-btn mui-btn-block mui-btn-primary">登录</button>
			</div>
		</div>
		<script type="text/javascript" src="js/immersed.js"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/app.js"></script>
		<script type="text/javascript" src="base.js"></script>
		<script type="text/javascript" charset="utf-8">
			(function($, doc) {

				mui.init();

				var settings = app.getSettings();
				mui.plusReady(function() {

					document.onkeydown = function(e) { //对整个页面文档监听
						var keyNum = window.event ? e.keyCode : e.which; //获取被按下的键值
						//判断如果用户按下了回车键（keycody=13）
						console.log("keyNum:" + keyNum);
						if(keyNum == 119) {
							document.getElementById("user").focus();
						}
						if(keyNum == 13) {
							document.getElementById("pass").focus();
						}
					}

					//预加载主页
					var mainPage = plus.webview.getWebviewById("main");

					//					mainPage = $.preload({
					//						"id": 'main',
					//						"url": 'html/main/home.html'
					//					});

					var self = plus.webview.currentWebview();
					var entrance = self.entrance;
					if(entrance === "userInfo") {
						/*
						 * 这种办法其实不是特别推荐，思路如下：
						 * 1、获取所有已经存在的窗口，当前页面以及入口页面
						 * 2、关闭所有窗口，只保留入口和当前的页面
						 * 3、如果关闭入口页面，app会挂掉的
						 * 4、重写mui.back()，因为按照之前的逻辑往回退，是退不了的；
						 */
						// http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.all
						var wvs = plus.webview.all();
						// http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.getLaunchWebview
						var fristWv = plus.webview.getLaunchWebview();
						// 关闭除当前页以及入口页面外所有页面
						for(var i = 0; i < wvs.length; i++) {
							if(wvs[i].getURL() == self.getURL() || wvs[i].getURL() == fristWv.getURL()) {
								continue;
							}
							wvs[i].close("none");
						}

						//						window.addEventListener('resize', function() {
						//							oauthArea.style.display = document.body.clientHeight > 400 ? 'block' : 'none';
						//						}, false);
						//						var backButtonPress = 0;
						//						$.back = function(event) {
						//							backButtonPress++;
						//							if(backButtonPress > 1) {
						//								plus.runtime.quit();
						//							} else {
						//								//								plus.nativeUI.toast('再按一次退出应用');
						//							}
						//							setTimeout(function() {
						//								backButtonPress = 0;
						//							}, 1000);
						//							return false;
						//						};

					}
					/**
					 * 点击登录按钮，进行登录；
					 * trim()方法是mui.js提供的，js本身并没有trim()方法；
					 * 许多新手在这里会出现一些问题，就是并不是在事件发生时候去获取手机号和密码，而是在事件外去获取；
					 * 在事件外获取的值，并不是最后点击提交时候的值，获取的永远是input框初始化的值，而不是它变化后的值；
					 */

					document.getElementById("loginApp").addEventListener("tap", function() {
						var user = document.getElementById("user").value.trim();
						var pass = document.getElementById("pass").value.trim();
						var area = document.getElementById("area").value;
						localStorage.setItem("user", user);
						//						var cat = localStorage.getItem("user");

						if("" == user) {
							mui.alert("用户名必须填写", "登陆信息验证", "确认");
							return;
						}
						if("" == pass) {
							mui.alert("密码必须填写", "登陆信息验证", "确认");
							return;
						}

						login(user, pass, area, entrance);
					});

					var settingPage = $.preload({
						"id": 'setting',
						"url": 'setting.html'
					});
					//设置
					var settingButton = doc.getElementById('setting');
					//settingButton.style.display = settings.autoLogin ? 'block' : 'none';
					settingButton.addEventListener('tap', function(event) {
						$.openWindow({
							id: 'setting',
							show: {
								aniShow: 'pop-in'
							},
							styles: {
								popGesture: 'hide'
							},
							waiting: {
								autoShow: false
							}
						});
					});
				});
				var first = null;
				mui.back = function() {
					if(!first) {
						first = new Date().getTime();
						//					plus.nativeUI.toast("再按一次退出应用");
						setTimeout(function() {
							first = null;
						}, 1000);
					} else {
						if(new Date().getTime() - first < 1000) {
							plus.runtime.quit();
						}
					}
				}
				var mask = mui.createMask(); //遮罩层
				function login(user, pass, area, entrance) { //调用登录接口
					mui.ajax(base + "/login/xmlSend.json", {
						//					mui.ajax('json/login.json', {

						data: {
							USERNAME: user,
							PASSWORD: pass,
							AREA: area
						},
						dataType: 'json', //服务器返回json格式数据
						type: 'post', //HTTP请求类型
						timeout: 30000, //超时时间设置为10秒；
						beforeSend: function() {
							plus.nativeUI.showWaiting("登陆中...");
							mask.show(); //显示遮罩层
						},
						complete: function() {
							plus.nativeUI.closeWaiting();
							mask.close(); //关闭遮罩层
						},
						success: function(data) {

							//可操作设备放入缓存
							localStorage.setItem("eqpList", data.EQPLIST);
							//显示菜单
							localStorage.setItem("FEATURESCODE", data.FEATURESCODE)

							if(data.LOGINRESULT == false) {
								mui.toast(data.MESSAGE)
							} else {
								if(data.ISACTIVE == false) {
									mui.toast(data.MESSAGE)
								} else {
									plus.storage.setItem("userInfo", data);
									mui.openWindow({
										url: 'html/main/home.html',
										id: "main",
										waiting: {
											autoShow: false
										},
										extras: {
											entrance: "login",
											user: user
										}
									});

									mui.toast(data.MESSAGE)
								}
							}
						},
						error: function(xhr, type, errorThrown) {
							plus.nativeUI.toast(errorThrown);
							//							if(type == "abort") {
							//								mui.toast("服务器请求失败！");
							//							}
							//							if(type == "timeout") {
							//								mui.toast("请求超时！");
							//							}
							console.log(errorThrown)
						}
					});
				}
			}(mui, document));
		</script>
	</body>

</html>

<script type="text/javascript">
	mui.plusReady(function() {
		// 在这里调用plus api
		mui.getJSON("manifest.json", null, function(jdata) {
			var version_local = jdata.version.name;
			console.log(version_local)
			localStorage.setItem("version_local", version_local);
			//console.log(version_local)
			mui.ajax(base + '/UpGradeApp', {
				data: {
					"version": version_local
				},
				dataType: 'json', //服务器返回json格式数据
				type: 'post', //HTTP请求类型
				timeout: 10000, //超时时间设置为10秒；
				success: function(data) {
					var version_server = data.version
					if(version_local != version_server) {
						var wgtUrl = encodeURI(base + "/" + data.downLoadURL)

						console.log(wgtUrl)
						//window.open(wgtUrl)
						downWgt(wgtUrl)
					}
				},
				error: function(xhr, type, errorThrown) {
					console.log("error")
				}
			});

		});

	});

	function downWgt(wgtUrl) {
		plus.nativeUI.showWaiting("下载更新文件...");
		plus.downloader.createDownload(wgtUrl, {
			filename: "_downloads/"
		}, function(d, status) {
			if(status == 200) {
				console.log("下载更新成功：" + d.filename);
				installWgt(d.filename); // 安装wgt包
			} else {
				console.log("下载apk失败！");
				plus.nativeUI.alert("下载更新失败！");
			}
			plus.nativeUI.closeWaiting();
		}).start();
	}

	// 更新应用资源
	function installWgt(path) {
		plus.nativeUI.showWaiting("安装更新文件...");
		plus.runtime.install(path, {}, function() {
			plus.nativeUI.closeWaiting();
			console.log("安装apk文件成功！");
			plus.nativeUI.alert("应用资源更新完成！", function() {
				plus.runtime.restart();
			});
		});
	}
	

mui.ready(function(){
	var _this = this 
	document.onkeydown=function(event){
		event =  event || window.event;
		console.log("onkeydown.keyCode:" + event.keyCode)
		var id = document.activeElement.id
		//扫描枪按钮事件
		//_this.user.blur()
		if(event.keyCode == 119){ 
			_this.user.focus()
		}
		 
	} 

})
 
</script>